<template>
  <Table :page="false" :tableColumn="tableColumn"
         border
         max-height="500px"
         :headerStyle="{backgroundColor:'#fffbed'}" :tableData="tableData"/>
</template>

<script>
import {selectLoanLaterAction} from '@/api/postLoan'

export default {
  props:['routesQuery'],
  name: "AccessRecord",
  data() {
    return {
      tableColumn: [
        {label: this.$t('首页'), prop: 'home'},
        {label: this.$t('订单详情页'), prop: 'order'},
        {label: this.$t('展期详情页'), prop: 'rollOver'},
        {label: this.$t('还款详情页'), prop: 'refund'},
        {label: this.$t('订单列表'), prop: 'orderList'},
      ],
      tableData: []
    }
  },
  mounted() {
    this.getList()
  },
  methods: {
    async getList() {
      const {orderId, userId} = this.routesQuery
      const res = await selectLoanLaterAction({
        loanRecordId: orderId,
        userId
      })
      if (res.code === 1) {
        const {home, order, orderList, refund, rollOver} = res.data
        // 获取数组最大值
        const maxLength = Math.max(...[home.length, order.length, orderList.length, refund.length, rollOver.length])
        for (let i = 0; i < maxLength; i++) {
          this.tableData.push({
            home: home[i],
            order: order[i],
            orderList: orderList[i],
            refund: refund[i],
            rollOver: rollOver[i],
          })
        }
      }
    }
  }
}
</script>

<style scoped>

</style>
